import 'package:date_format/date_format.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_cupertino_datetime_picker/flutter_cupertino_datetime_picker.dart';
import 'package:imember/UI/Trip/TripDetail.dart';
import 'package:imember/Util/MyColor.dart';
import 'package:imember/Widget/MyDialog.dart';
import 'package:imember/Widget/MyImage.dart';
import 'package:imember/Widget/MyInput.dart';
import 'package:imember/Widget/MyPage.dart';

class TripManager extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _TripManager();
  }
}

class _TripManager extends State {
  @override
  Widget build(BuildContext context) {
    return MyPage(
        Container(
          child: Column(children: [
            Container(height: 28),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [SearchInput(), Container(width: 32), DateInput(onConfirm: (date) {})],
            ),
            Container(height: 32),
            Container(height: 1, color: MyColor.C4),
            Expanded(
              child: true
                  ? ListView.builder(
                      padding: EdgeInsets.all(0),
                      itemCount: 3,
                      itemBuilder: (BuildContext context, int index) {
                        return ItemTrip();
                      },
                    )
                  : Center(child: Text("目前尚無行程", style: TextStyle(fontSize: 30, color: MyColor.C70, fontWeight: FontWeight.bold))),
            )
          ]),
        ),
        showNotice: true,
        showIcon: true);
  }
}

class SearchInput extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 350,
      height: 35,
      padding: EdgeInsets.fromLTRB(16, 0, 16, 0),
      decoration: BoxDecoration(borderRadius: BorderRadius.all(Radius.circular(24)), border: Border.all(width: 1.2, color: MyColor.C58)),
      child: Row(children: [
        Expanded(
            child: NormalInput(
          hintText: "請輸入車牌號碼",
        )),
        LocalImage("ic_search.png", width: 24, height: 24)
      ]),
    );
  }
}

class DateInput extends StatefulWidget {
  Function(String date) onConfirm;

  DateInput({required this.onConfirm});

  @override
  State<StatefulWidget> createState() {
    return _DateInput();
  }
}

class _DateInput extends State<DateInput> {
  String date = "";
  Function(DateTime dateTime, List<int> selectedIndex)? onConfirm;

  chooseDate(BuildContext context) {
    FocusManager.instance.primaryFocus?.unfocus();
    DatePicker.showDatePicker(context,
        dateFormat: "yyyy年 MM月 dd日",
        pickerTheme: DateTimePickerTheme(confirm: Text("確認", style: TextStyle(fontSize: 14, color: MyColor.C58))),
        onConfirm: (DateTime dateTime, List<int> selectedIndex) {
      setState(() {
        date = formatDate(dateTime, [yyyy, '-', mm, '-', dd]);
        widget.onConfirm(date);
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
        onTap: () {
          chooseDate(context);
        },
        child: Container(
            width: 350,
            height: 35,
            padding: EdgeInsets.fromLTRB(16, 0, 16, 0),
            decoration:
                BoxDecoration(borderRadius: BorderRadius.all(Radius.circular(24)), border: Border.all(width: 1.2, color: MyColor.C58)),
            child: Row(children: [
              Expanded(
                  child: Text(
                date.isEmpty ? "請輸入日期" : date,
                style: TextStyle(fontSize: 14, color: date.isEmpty ? MyColor.A0 : MyColor.Black),
              )),
              LocalImage("ic_search.png", width: 24, height: 24)
            ])));
  }
}

class ItemTrip extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
        behavior: HitTestBehavior.translucent,
        onTap: (){
          showWidgetDialog(context, TripDetail());
        },
        child: Container(
            child: Column(children: [
          Row(mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [
            Container(width: 62),
            Expanded(
                child: Column(crossAxisAlignment: CrossAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.center, children: [
              Container(height: 16),
              Text("2021/09/01", style: TextStyle(fontSize: 20, color: MyColor.Orange)),
              Container(height: 8),
              Text("03:00 PM　　　　BME-432", style: TextStyle(fontSize: 17)),
              Container(height: 16),
            ])),
            Text("查看", style: TextStyle(fontSize: 20, color: MyColor.C51)),
            LocalImage("ic_arrow_r.png", width: 44, height: 44)
          ]),
          Container(height: 1, color: MyColor.C4),
        ])));
  }
}
